<template>
	<div class="regBox" v-if="is_show">
		<div class="con">
			<i aria-label="图标: close" class="close" @click="closeUserMsg">
				<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16" data-icon="close" fill="currentColor" aria-hidden="true" focusable="false" class="">
					<g id="comm_icon_x" transform="translate(-1209.5 -160.5)">
						<path id="Line_14" data-name="Line 14" d="M14,15a1,1,0,0,1-.707-.293l-14-14a1,1,0,0,1,0-1.414,1,1,0,0,1,1.414,0l14,14A1,1,0,0,1,14,15Z" transform="translate(1210.5 161.5)"></path>
						<path id="Line_15" data-name="Line 15" d="M0,15a1,1,0,0,1-.707-.293,1,1,0,0,1,0-1.414l14-14a1,1,0,0,1,1.414,0,1,1,0,0,1,0,1.414l-14,14A1,1,0,0,1,0,15Z" transform="translate(1210.5 161.5)"></path>
					</g>
				</svg>
			</i>
			<div class="title">{{$t('h_pcreg.title6')}}</div>
			<div class="htmltext" v-html="$t('h_pcreg.title15')"></div>
			<div class="btn" @click="closeUserMsg">{{$t('h_pcreg.title14')}}</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				is_show:false,
				step:0,
				checked:true,
				message:'<p style="text-align: center;">&nbsp;</p><p>1. 为避免于本公司投注时之争议，请会员务必于进入app前详阅本公司定制各项规则，客户一经“我同意”进入本公司进行投注时，即被视为已接受本公司。</p><p>2. 会员有责任确保自己的帐户以及登入资料的保密性，以会员帐号及密码进行的任何线上投注，将被视为有效。敬请不定时做密码变更之动作。若帐号密码被盗用，进行的投注，本公司一概不负赔偿责任。</p><p>3. 本公司保留不定时更改本协定或游戏规则或保密条例，更改之条款将从更改发生后指定之日起生效，并保留一切有争议事项及最后的决策权。</p><p>4. 用户须达到居住地国家法律规定之合法年龄方可使用线上娱乐场或app。网上投注如未能成功提交投注将被视为无效。</p><p>5. 凡玩家于出牌途中且尚无结果前自动或强制断线时，并不影响比赛之结果。</p>',
				formData: {
					username: '',
					password: '',
					password_cp: ''
				}
			};
		},
		methods: {
			openUserMsg(){
				this.is_show = true
			},
			closeUserMsg(){
				this.is_show = false
			},
		}
	}
</script>

<style lang="less" scoped>
	*{
		box-sizing: border-box;
	}
	.regBox{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, .5);
		z-index: 997;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.con{
		width: 433px;
		height: auto;
		background-color: var(--theme-top-nav-bg);;
		border: thin solid;
		border-color: var(--theme-color-line);
		border-radius: 10px;
		position: relative;
		padding: 0 23px 15px 23px;
	}
	.close{
		color: var(--theme-text-color);
		font-size: 12px;
		height: 44px;
		line-height: 44px;
		width: 44px;
		text-align: center;
		position: absolute;
		right: 0;
		top: 0;
	}
	.title{
		margin-top: 15px;
		margin-bottom: 31px;
		font-size: 17px;
		color: #fff;
		font-weight: 700;
		text-align: center;
	}
	.htmltext{
		color: var(--theme-text-color);
		font-size: 14px;
	}
	.btn{
		width: 100%;
		height: 43px;
		text-align: center;
		line-height: 43px;
		background-color: var(--theme-primary-color);
		margin-bottom: 15px;
		margin-top: 15px;
		color: #fff;
		font-size: 15px;
		border-radius: 10px;
		cursor: pointer;
	}
</style>